import React, { Component } from 'react'
import { TopNavHeader, HintMessage } from '../common'

export default class BankcardListPage extends Component {
  render() {
    return (
      <div className={`rt-bankcard-list-container cm-flex-container`}>
        <TopNavHeader title="银行卡" />

        <HintMessage text="银行卡：3张" extraText="添加规则" />

        <div className={`rt-bankcard-list-box`}>
          {
            Array(12).fill(1).map(v => (
              <div key={Math.random()} className={`rt-bankcard-box`}>
                <div className={`rt-left-box`}>
                  <span className={`rt-bank-name`}>中国工商银行</span>
                  <span>**** **** **** 1113</span>
                </div>

                <div>解除</div>
              </div>
            ))
          }
          <div className={`rt-add-bankcard-box`}>
            <span className={`rt-plus-sign`}>＋</span>
            <span>添加一张银行卡</span>
          </div>
        </div>
      </div>
    )
  }
}